<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge"><!--edge浏览器H5兼容设置-->
	<meta name="renderer" content="webkit" /><!--360浏览器H5兼容设置-->
	<title>登录</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!--导入核心文件-->
	<script src="../bootstrap3/jquery-1.9.1.min.js"></script>
	<script src="../bootstrap3/js/bootstrap.js"></script>
	<script src="../bootstrap3/js/holder.js"></script>
	<link href="../bootstrap3/css/bootstrap.css" rel="stylesheet" type="text/css">
	<!-- 字体图标 -->
	<link rel="stylesheet" href="../bootstrap3/font-awesome-4.7.0/css/font-awesome.css" />
	<link rel="stylesheet" type="text/css" href="../css/top.css" />
	<link rel="stylesheet" type="text/css" href="../css/index.css" />
	<link rel="stylesheet" type="text/css" href="../css/layout.css" />
	<link rel="stylesheet" type="text/css" href="../css/login.css" />
	<link rel="stylesheet" type="text/css" href="../css/footer.css" />
	<link rel="shortcut icon" href="../favicon.ico" />

	<script src="../bootstrap3/js/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/autoLogin.js" type="text/javascript"></script>
	<!--页签图标-->
	<link rel="shortcut icon" href="web/images/ico/favicon.ico"/>
	<!--我的工具-->
	<script src="../common/LinsCommon.js" type="text/javascript" charset="utf-8"></script>
	<base href="http://sso.stp.com/">
</head>
<body>
	<!--主体-->
	<div class="loginPage">
		<!--透明层 -->
		<div class="loginDiv">
			<h3>用户登录</h3>
			<!--表单开始-->
			<form id="form-login" action="home.html" class="form-horizontal" role="form">
				<!--用户名-->
				<div class="form-group">
					<div class="col-md-8 username">
						<input name="username" type="text" class="form-control" id="username" placeholder="请输入用户名">
					</div>
				</div>
				<!--密码-->
				<div class="form-group">
					<div class="col-md-8 password">
						<input name="password" type="text" class="form-control" id="password" placeholder="请输入密码">
					</div>
				</div>
				<!--验证码-->
				<div class="form-group">
					<div class="col-md-8 verification">
						<div class="clo-2">
							<input name="verification" type="text" class="form-control" id="verification" width="50%" placeholder="请输入验证码">
							<img id="imgCode" ref="vcImg" src="common/getYzmImage" alt="验证码">
						</div>
					</div>
				</div>
				<!--隐藏：IP-->
				<input id="clientIp" name="clientIp" type="hidden" >
				<input id="clientArea" name="clientArea" type="hidden" >
				<!-- 记住我-->
				<div class="form-group">
					<div class=" col-md-8">
						<div class="checkbox">
							<label>
								<input type="checkbox" id="auto" name="remember-me">自动登录
							</label>
						</div>
					</div>
				</div>
				<!--提交按钮-->
				<div class="form-group">
					<div>
						<div class="clo-2">
							<input id="btn-login" class="btn btn-primary" type="button" value="登录" onclick="doLogin()"/>
						</div>
						<span class="pull-right"><small>还没有账号？</small><a href="register.html">注册</a></span>
					</div>
				</div>
			</form>
		</div>
	</div>
	<script type="text/javascript">

		//必须放在Init函数外面，才能被html识别到

		//页面初始化时执行多参校验
		const rules = {
			username: '请填入用户名',
			password: '请填入密码',
			verification: '请填入图形验证码'
		};
		initMultipleCheck(1,rules);

		let doLogin = function (){
			if (initMultipleCheck(2,rules)) {
				//获取客户端IP地址
				// $.ajax({
				//     url: ip33Url,
				//     type: "GET",
				//     async: false,
				//     // cache: false,
				//     dataType: "json",
				//     success: searchIpSuccess,
				//     error:error
				// });
				$.ajax({
					url: netBasePath+"/user/doLogin",
					type: "POST",
					data: $("#form-login").serialize(),
					dataType: "json",
					sync: false,
					success: function (r){
						if (r.code == 200) {
							//如果有原url
							// if (json.data.avatar) {
							// 	location.href = json.data.avatar;
							// 	return;
							// }
							const token = r.data.token;
							if(token){
								localStorage.setItem('token',token);
							}
							switch (r.data.level) {
								case "admin":
									// case "ROLE_LOGIN":
									location.href = "admin.html";
									break;
								case "99":
									alert("当前浏览器已经有用户登录系统！请先把原登录账户注销登录，或换一个浏览器登录你的账号！");
									location.href = "logout.html";
									break;
								default:
									location.href = "web/page/home.html";
									break;
							}
						} else {
							$("#imgCode").attr("src", netBasePath+"/common/getYzmImage?" + Math.random());
							alert("登录失败！" + r.msg);
						}
					},
					error: error
				});
			} else {
				initMultipleCheck(rules);
			}
		}


		$(function () {
			// 重新获取表单验证码
			$("#imgCode").click(function () {
				console.log("重新获取表单验证码");
				// 直接通过src去请求验证码图片 通过Math.random()防止缓存问题
				$("#imgCode").attr("src", netBasePath+"/common/getYzmImage?" + Math.random());
			});

			//输入完验证码直接回车键触发登录
			$("#imgCode").keydown(function (e) {
				if (e.keyCode == 13) {
					// $("#btn-login").click();
					doLogin();
				}
			});
		})
	</script>
</body>

</html>